html,
body {
  width: 100%;
  height: 100%;
}

body {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-family: Microsoft YaHei, Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Arial, sans-serif;
  font-size: 14px;
  color: #333333;
  background-color: #f6f6f6;
  overflow: hidden;
}

// v-cloak
[v-cloak] {
  display: none;
}

//两行省略号
.ellipsis--two-line {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}

//单行省略号
.ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

// 隐藏元素
.hidden {
  display: none;
}

// 主题相关变量
:root {
  // 文字颜色
  --color-primary: #3378ff; // 主题色
  --color-green: #67c23a; // 绿色
  --color-red: #f56c6c; // 红色
  --color-black: #333333; //黑色
  --color-deep-gray: #666666; //深灰色
  --color-gray: #999999; // 灰色

  // 边框颜色
  --border-color: #f2f6fc; // 灰色
}

// 文字颜色
// 主题色
.color-primary {
  color: var(--color-primary);
}
// 绿色
.color-green {
  color: var(--color-green);
}
// 红色
.color-red {
  color: var(--color-red);
}
//黑色
.color-black {
  color: var(--color-black);
}
//深灰色
.color-deep-gray {
  color: var(--color-deep-gray);
}
// 灰色
.color-gray {
  color: var(--color-gray);
}

// 滚动
.scroll-box {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

// 边框
.border {
  border: 1px soild var(--border-color);
}

.border-top {
  border-top: 1px solid var(--border-color);
}

.border-right {
  border-right: 1px solid var(--border-color);
}

.border-bottom {
  border-bottom: 1px solid var(--border-color);
}

.border-left {
  border-left: 1px solid var(--border-color);
}

// 暂无数据
.no-data-box {
  padding: 0.32rem 0.426667rem;
  text-align: center;
  color: var(--color-gray);
  font-size: 0.373333rem;
}

// 加载更多
.loading-box {
  width: 100%;

  .finished {
    padding: 0.213333rem 0 0;
    color: var(--color-gray);
    font-size: 0.32rem;
    text-align: center;
  }

  .loading {
    padding: 0.213333rem 0 0;
    text-align: center;
  }
}

// 搜索框外的form样式
.form-search {
  width: 100%;
}
